window.onload = function(){
    //分页
var table_box_content=document.getElementsByClassName("table_box_content");
search(1);
function search(i){
    //接口
    $.ajax({
        type:"post",
        url:"http://118.195.129.130:3000/food/getInfoByPage",
        //async默认是true，表示异步方式，$.ajax执行后，会继续执行ajax后的脚本，直至服务端返回数据，
        //触发success方法
        async:true,
        data:{
            page:i,
            per_page:10
        },
        success:function(data){
            //console.log(data);
            //console.log(data.data[0]);
            //将ajax获取的数据添加到网页中
            table_box_content[0].innerHTML=data.data[0].name;
            table_box_content[1].innerHTML=data.data[0].price;
            table_box_content[2].innerHTML=data.data[0].desc;
            table_box_content[3].innerHTML=data.data[0].typename;
            table_box_content[4].innerHTML=data.data[0]._id;

            table_box_content[6].innerHTML=data.data[1].name;
            table_box_content[7].innerHTML=data.data[1].price;
            table_box_content[8].innerHTML=data.data[1].desc;
            table_box_content[9].innerHTML=data.data[1].typename;
            table_box_content[10].innerHTML=data.data[1]._id;

            table_box_content[12].innerHTML=data.data[2].name;
            table_box_content[13].innerHTML=data.data[2].price;
            table_box_content[14].innerHTML=data.data[2].desc;
            table_box_content[15].innerHTML=data.data[2].typename;
            table_box_content[16].innerHTML=data.data[2]._id;

            table_box_content[18].innerHTML=data.data[3].name;
            table_box_content[19].innerHTML=data.data[3].price;
            table_box_content[20].innerHTML=data.data[3].desc;
            table_box_content[21].innerHTML=data.data[3].typename;
            table_box_content[22].innerHTML=data.data[3]._id;

            table_box_content[24].innerHTML=data.data[4].name;
            table_box_content[25].innerHTML=data.data[4].price;
            table_box_content[26].innerHTML=data.data[4].desc;
            table_box_content[27].innerHTML=data.data[4].typename;
            table_box_content[28].innerHTML=data.data[4]._id;

            table_box_content[30].innerHTML=data.data[5].name;
            table_box_content[31].innerHTML=data.data[5].price;
            table_box_content[32].innerHTML=data.data[5].desc;
            table_box_content[33].innerHTML=data.data[5].typename;
            table_box_content[34].innerHTML=data.data[5]._id;
        },
        error:function(err){
            console.log(err);
        }
    })
}
//点击按钮换页
var btn=document.getElementsByClassName("btn");
    for(let i=0;i<btn.length;i++){
        btn[i].onclick=function(){
            console.log(i+1);
            search(i+1);
        }
    }


//增删改查
// var table_box=document.getElementsByClassName("table_box")
// var allA=document.getElementsByTagName("a")
// var table=document.getElementById("table")
var Search=document.getElementById("search")
var change1=document.getElementById("change1")
var cha1=document.getElementById("change1_1")
var cha2=document.getElementById("change1_2")
var cha3=document.getElementById("change1_3")
var cha4=document.getElementById("change1_4")
var cha5=document.getElementById("change1_5")
var change2=document.getElementsByClassName("change2")
var del=document.getElementsByClassName("del")
var sure=document.getElementById("sure")
var chance=document.getElementById("chance")
var box2=document.getElementById("box2")
var more=document.getElementById("more")
var more1=document.getElementById("more1")
var more2=document.getElementById("more2")
var more3=document.getElementById("more3")
var more4=document.getElementById("more4")



//改
var chan;
var inp=change1.getElementsByTagName("input")
for(var i=0;i<change2.length;i++){
        change2[i].onclick=function(){
            change1.style.opacity=1;
            //change2的父节点的父节点，精准获取修改哪一行
            chan=this.parentNode.parentNode;
            //把修改框添加在页面中
            var names=chan.childNodes[0].innerHTML;
            var price=chan.childNodes[1].innerHTML;
            var desc=chan.childNodes[2].innerHTML;
            var typename=chan.childNodes[3].innerHTML;
            var _id=chan.childNodes[4].innerHTML;
            //把内容放在修改框中
            cha1.innerHTML=names;
            cha2.innerHTML=price;
            cha3.innerHTML=desc;
            cha4.innerHTML=typename;
            cha5.innerHTML=_id;
        }
}
//确认修改
sure.onclick=function(){
    $.ajax({
        type:"post",
        url:"http://118.195.129.130:3000/food/update",
        async:true,
        //确定修改的数据
        data:{
            name:cha1.value,
            price:cha2.value,
            desc:cha3.value,
            typename:cha4.value,
            _id:cha5.value
        },
        success:function(data){
            var chan_class=chan.getElementsByClassName("table_box_content")
            //点击确定修改后添加内容文本
            chan_class[1].innerText=cha1.value
            chan_class[2].innerText=cha2.value
            chan_class[3].innerText=cha3.value
            chan_class[4].innerText=cha4.value
            chan_class[5],innerText=cha5.value
            console.log(data);
            //弹窗，修改成功
            alert(data.msg);
            //调用分页函数，刷新修改过的页面
            search(1);
            //隐藏修改框
            change1.style.opacity=0;
            //清空修改框内容
            for(var i=0;i<inp.length;i++){
                inp[i].value=" "
            }
        },
        error:function(err){
            console.log(err);
        }
    })
}
//取消修改
chance.onclick=function(){
    change1.style.opacity=0;
    for(var i=0;i<inp.length;i++){
        inp[i].value=" "
    }
}


//删
for(let i=0;i<del.length;i++){
    del[i].onclick=function(){
        //获取需要删除的id
        var id=table_box_content[(i+1)*6-2].innerHTML
        $.ajax({
            type:"post",
            url:"http://118.195.129.130:3000/food/del",
            async:true,
            data:{
                _id:id
            },
            success:function(data){
                alert(data.msg);
                search(1);
            },
            error:function(err){
                console.log(err);
            }
        })
    }
}


//增
var morePut=box2.getElementsByTagName("input")
more.onclick=function(){
        $.ajax({
            type:"post",
            url:"http://118.195.129.130:3000/food/add",
            async:true,
            data:{
                name:more1.value,
                price:more2.value,
                desc:more3.value,
                typename:more4.value,
                typeid:" "
            },
            success:function(data){
                //添加增上去的文本
                more1.innerText=more1.value
                more2.innerText=more2.value
                more3.innerText=more3.value
                more4.innerText=more4.value
                console.log(data);
                alert(data.msg);
                //清空修改框内容
                for(let i=0;i<morePut.length;i++){
                    morePut[i].value=" "
                }
                //调用分页，刷新页面，使增的内容添上去
                search(1);
            },
            error:function(err){
                console.log(err);
            }
        })
}

//查
var put_search=document.getElementById("put_search")
var put_name=document.getElementById("put_name")
var Search=document.getElementById("search")
var searchAdd=document.getElementsByClassName("searchAdd")[0];
Search.onclick=function(){
    $.ajax({
        type:"post",
        url:"http://118.195.129.130:3000/food/getInfoByKw",
        async:true,
        data:{
            kw:put_name.value
            //kw:"好吃"
        },
        success:function(data){

            var zz=data.data.length;
           console.log(data);
           console.log(data.data.length);
           for(let i=0;i<data.data.length;i++){
               //创建一个div，添加在在HTML中已建好准备被撑开的div中
                var addDiv=document.createElement("div");
                addDiv.className="addDiv";
                searchAdd.appendChild(addDiv);
                //创建完成后获取
                var addDiv=document.getElementsByClassName("addDiv");
                
                for(let j=0;j<5;j++){
                    var adda=document.createElement("div");
                    adda.className="adda";
                    addDiv[i].appendChild(adda);
                    
                }
                var adda=document.getElementsByClassName("adda");
                    console.log(data.data[0].name);
                    adda[i*5].innerHTML=data.data[i].name;
                    adda[i*5+1].innerHTML=data.data[i].price;
                    adda[i*5+2].innerHTML=data.data[i].desc;
                    adda[i*5+3].innerHTML=data.data[i].typename;
                    adda[i*5+4].innerHTML=data.data[i]._id;
           }
           Search.onclick=function(){
               for(let k=0;k<zz;k++){
                    searchAdd.removeChild(addDiv[0]);
               }
               addDelete();
           }
           put_name.value=" "
        },
        error:function(data){
                console.log(err);
        }
    })
}

function addDelete(){

        $.ajax({
            type:"post",
            url:"http://118.195.129.130:3000/food/getInfoByKw",
            async:true,
            data:{
                kw:put_name.value
                //kw:"好吃"
            },
            success:function(data){
                var zz=data.data.length;
               console.log(data);
               console.log(data.data.length);
               for(let i=0;i<data.data.length;i++){
                    var addDiv=document.createElement("div");
                    addDiv.className="addDiv";
                    searchAdd.appendChild(addDiv);
                    var addDiv=document.getElementsByClassName("addDiv");
                    for(let j=0;j<5;j++){
                        var adda=document.createElement("div");
                        adda.className="adda";
                        addDiv[i].appendChild(adda);
                        
                    }
                    var adda=document.getElementsByClassName("adda");
                        console.log(data.data[0].name);
                        adda[i*5].innerHTML=data.data[i].name;
                        adda[i*5+1].innerHTML=data.data[i].price;
                        adda[i*5+2].innerHTML=data.data[i].desc;
                        adda[i*5+3].innerHTML=data.data[i].typename;
                        adda[i*5+4].innerHTML=data.data[i]._id;
               }
               Search.onclick=function(){
                for(let k=0;k<zz;k++){
                     searchAdd.removeChild(addDiv[0]);
                }
                addDelete();
            }
    
            },
            error:function(data){
                    console.log(err);
            }
        })
}

//退出登录
var quit=document.getElementById("quit")
quit.onclick=function(){
    $.ajax({
        type:"post",
        url:"http://118.195.129.130:3000/user/out",
        async:true,
        success:function(data){
            alert(data.msg)
            window.location.href="../index2.html"
        },
        error:function(err){

        }
    })
}

//在第几页按钮就显示第几页
var index=0;
//btn在分页的时候已经获取过
var act=document.getElementById("act")
var clearAct=function(){
    for(var i=0;i<btn.length;i++){
        btn[i].className="btn";
    }
}
var goIndex=function(){
    clearAct();
    btn[index].className="btn act";
}
for(var i=0;i<btn.length;i++){
	btn[i].addEventListener('click',function(){
		var btnIndex= this.getAttribute('data-index');
		index=btnIndex;
		goIndex();
		time=0;
	})
}

}

